<ui:composition xmlns="http://www.w3.org/1999/xhtml"
		xmlns:ui="http://java.sun.com/jsf/facelets"
		xmlns:h="http://java.sun.com/jsf/html"
		xmlns:f="http://java.sun.com/jsf/core"
		xmlns:p="http://primefaces.org/ui"
		template="/resources/template/template_bootstrap.xhtml">

		<ui:define name="title">Minha Área</ui:define>

		<ui:define name="conteudo">

				<p:outputPanel layout="block"
						rendered="#{usuarioMB.permissaoAdministrador()}">

						<p:dataTable value="#{vendasRealizadasMB.vendas}" var="v" 
								paginator="true" paginatorAlwaysVisible="false" rows="10" rowsPerPageTemplate="10,20,30"
								styleClass="tabela-carrinho">

								<p:ajax event="rowToggle"
										listener="#{vendasRealizadasMB.onRowToggle}" />

								<p:column headerText="Pedido Nº" sortBy="#{v.id}"
										filterBy="#{v.id}">
										<h:outputText value="#{v.id}">
										</h:outputText>
								</p:column>

								<p:column headerText="Data" sortBy="#{v.dataVenda.time}"
										filterBy="#{v.dataVenda.time}">
										<h:outputText value="#{v.dataVenda.time}">
												<f:convertDateTime pattern="dd/MM/yyyy"></f:convertDateTime>
										</h:outputText>
								</p:column>

								<p:column headerText="Status" sortBy="#{v.status.nome}"
										filterBy="#{v.status.nome}">
										<h:outputText value="#{v.status.nome}"></h:outputText>
								</p:column>

								<p:column headerText="Total da Venda" styleClass="text-right">
										<h:outputText value="#{v.totalVenda}">
												<f:convertNumber type="currency" />
										</h:outputText>
								</p:column>

								<p:column headerText="Frete" styleClass="text-right">
										<h:outputText value="#{v.totalFrete}">
												<f:convertNumber type="currency" />
										</h:outputText>
								</p:column>

								<p:column headerText="Total da Geral" styleClass="text-right">
										<h:outputText value="#{v.totalGeral}">
												<f:convertNumber type="currency" />
										</h:outputText>
								</p:column>

								<p:column headerText="Detalhes" style="width:2%">
										<p:rowToggler />
								</p:column>


								<p:rowExpansion>

										<h:form prependId="false">

												<div class="row-fluid">
														<div class="span3">
																<p:outputLabel value="Cliente" styleClass="text-right" />
														</div>
														<div class="span9">
																<p:outputLabel
																		value="#{vendasRealizadasMB.venda.cliente.nome}" />
														</div>
												</div>

												<div class="row-fluid">
														<div class="span3">
																<p:outputLabel value="Telefone 1"
																		styleClass="text-right" />
														</div>
														<div class="span9">
																<p:outputLabel
																		value="#{vendasRealizadasMB.venda.cliente.telefone1}" />
														</div>
												</div>

												<div class="row-fluid">
														<div class="span3">
																<p:outputLabel value="Telefone 2"
																		styleClass="text-right" />
														</div>
														<div class="span9">
																<p:outputLabel
																		value="#{vendasRealizadasMB.venda.cliente.telefone2}" />
														</div>
												</div>

												<div class="row-fluid">
														<div class="span3">
																<p:outputLabel value="E-mail" styleClass="text-right" />
														</div>
														<div class="span9">
																<p:outputLabel
																		value="#{vendasRealizadasMB.venda.cliente.email}" />
														</div>
												</div>

												<div class="row-fluid">
														<div class="span3">
																<p:outputLabel value="Endereço de Entrega"
																		styleClass="text-right" />
														</div>
														<div class="span9">
																<h:outputText
																		value="#{vendasRealizadasMB.venda.enderecoEntrega.logradouro.nome}: " />
																<h:outputText
																		value="#{vendasRealizadasMB.venda.enderecoEntrega.rua}, " />
																<h:outputText
																		value="Nº: #{vendasRealizadasMB.venda.enderecoEntrega.numero}, " />
																<h:outputText
																		value="#{vendasRealizadasMB.venda.enderecoEntrega.bairro}, " />
																<h:outputText
																		value="Nº: #{vendasRealizadasMB.venda.enderecoEntrega.cep}, " />
																<h:outputText
																		value="#{vendasRealizadasMB.venda.enderecoEntrega.cidade.nome} - " />
																<h:outputText
																		value="#{vendasRealizadasMB.venda.enderecoEntrega.cidade.estado.sigla}" />
														</div>
												</div>


												<div class="row-fluid">
														<div class="span3">
																<p:outputLabel value="Produtos Adquiridos"
																		styleClass="text-right" />
														</div>
														<div class="span9">

																<p:dataTable value="#{vendasRealizadasMB.venda.itens}"
																		var="i" styleClass="tabela-carrinho">

																		<p:column headerText="Produto">
																				<div class="foto-produto-mini">
																					<p:graphicImage
																						styleClass="img-foto-produto-mini"
																						value="/temp/#{fotoExibirMB.fotoProduto(i.produto).descricao}.jpg" />
																				</div>
																				<h:outputText value="#{i.produto.nome}" />
																		</p:column>

																		<p:column headerText="Quantidade">
																				<h:outputText value="#{i.quantidade}" />
																		</p:column>

																		<p:column headerText="Total" styleClass="text-right">
																				<h:outputText value="#{i.total}">
																						<f:convertNumber type="currency"></f:convertNumber>
																				</h:outputText>
																		</p:column>

																</p:dataTable>
														</div>
												</div>

												<div class="row-fluid margin-top">
														<div class="span3">
																<p:outputLabel value="Status do Pedido"
																		styleClass="text-right" />
														</div>
														<div class="span4">

																<p:selectOneMenu
																		value="#{vendasRealizadasMB.novoStatus}"
																		style="width:250px;">
																		<f:selectItems value="#{vendasRealizadasMB.status}"
																				var="s" itemLabel="#{s.nome}" itemValue="#{s}" />
																</p:selectOneMenu>
														</div>
														<div class="span5">
																<p:commandLink value="Alterar Status" update="@all" styleClass="btn"
																		actionListener="#{vendasRealizadasMB.alterarStatus(vendasRealizadasMB.venda)}" />
														</div>

												</div>

										</h:form>
								</p:rowExpansion>

						</p:dataTable>

				</p:outputPanel>

		</ui:define>
</ui:composition>